import {
  BrowserRouter as Router,
  Switch,
  Route,
  useParams,
  useHistory,
  useLocation,
  useRouteMatch,
  matchPath,
} from "react-router-dom";
import "./index.css";
function Dynamic(props) {
  const { id } = useParams();
  let history = useHistory();
  let location = useLocation();
  let match = useRouteMatch();
  console.log(id, history, location, match);
  console.log(props.match);

  // 手动判断当前路由是否符合规则  匹配时，它返回一个对象 否则为
  const match2 = matchPath("/Dynamic/123", {
    path: "/Dynamic/:id",
    exact: true,
    strict: false,
  });
  console.log(match2);

  return (
    <div>
      动态路由————拿到的ID为 <span className="activeFize">{id}</span>
    </div>
  );
}
export default Dynamic;
